<template>
  	<el-dialog v-model="dialogFormVisible" :title='title' width="600px" align-center draggable>
		<div class="dialog-content">
			<el-form ref="ruleFormRef" :model="formData" :rules="rules" label-width="100px">
				<el-form-item label="账号" prop="account">
					<el-input v-model="formData.account" />
				</el-form-item>
				<el-form-item v-if="title == '新增产品管理弹框' || title == '新增用户管理弹框' || title == '新增消息管理弹框' " label="密码" prop="password">
					<el-input v-model="formData.password" show-password />
				</el-form-item>
				<el-form-item label="姓名" prop="name">
					<el-input v-model="formData.name" />
				</el-form-item>
				<el-form-item label="性别" prop="sex">
					<el-select v-model="formData.sex" placeholder="请选择性别">
						<el-option label="男" value="男" />
						<el-option label="女" value="女" />
					</el-select>
				</el-form-item>
				<el-form-item label="邮箱" prop="email">
					<el-input v-model="formData.email" />
				</el-form-item>
				<el-form-item label="部门" prop="department">
					<el-select v-model="formData.department" placeholder="请选择部门">
						<el-option v-for="item in departmentData" :key="item" :label="item" :value="item" />
					</el-select>
				</el-form-item>
			</el-form>
		</div>
		<template #footer>
			<span class="dialog-footer">
				<el-button type="primary" @click="addAdmin">
					确定
				</el-button>
			</span>
		</template>
	</el-dialog>
</template>

<script setup lang="ts">
import {ref,reactive} from 'vue'
import type {createAdminFormData} from '@/api/userinfo/type'
import {createAdmin,editAdmin} from '@/api/userinfo/index'
import {getDepartment} from '@/api/setting/index'
import { ElMessage } from "element-plus"
const dialogFormVisible = ref(false)
const title = ref('')
const formData = reactive({
    account:'',
    password:'',
    name:'',
    sex:'',
    email:'',
    department:'',
})
const departmentData = ref([])
const returnDepartment = async()=>{
	const res = await getDepartment()
	if(res.status == 0){
		departmentData.value = JSON.parse(res.data)
	}
}
returnDepartment()
	const rules = reactive({
		account: [
			{ required: true, message: '请输入管理员的注册账号', trigger: 'blur' },
		],
		password: [
			{ required: true, message: '请输入管理员的注册密码', trigger: 'blur' },
		],
		name: [
			{ required: true, message: '请输入管理员的名字', trigger: 'blur' },
		],
		sex: [
			{ required: true, message: '请输入管理员的性别', trigger: 'blur' },
		],
		email: [
			{ required: true, message: '请输入管理员的邮箱', trigger: 'blur' },
		],
		department: [
			{ required: true, message: '请输入管理员的部门', trigger: 'blur' },
		],
	})
//点击确定事件

const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
const addAdmin = async()=>{
    let data:createAdminFormData ={
        account:formData.account,
        name:formData.name,
        sex:formData.sex,
        department:formData.department,
        email:formData.email, 
        identity:types.value == 1  ? '产品管理员' : (types.value == 2) ? '用户管理员' :'消息管理员' ,
    }
    if(title.value == '新增产品管理弹框' || title.value == '新增用户管理弹框' || title.value == '新增消息管理弹框'){
        data['password'] = formData.password
    }else{
        data['id'] = id.value
    }
    const res:any =    id.value  ?  await editAdmin(data)  : await createAdmin(data) 
    console.log('res',res)
    if(res.status == 0){
        ElMessage({
            type:'success',
            message:id.value ? '编辑成功' : '新增成功'
        })
        dialogFormVisible.value = false
        
        emit('success')
    }else{
        ElMessage({
            type:'error',
            message:id.value ? '编辑失败' : '新增失败'
        })
    }
}
const id = ref()
const types = ref<number>(0)
const open = (type:number,row:any)=>{
	types.value = type
    if(row){
        id.value = row.id
        Object.assign(formData,row)
        if(type == 1){
            title.value = '编辑产品管理弹框'
			
        }else if (type == 2){
			title.value = '编辑用户管理弹框'
		}else if(type == 3){
			title.value = '编辑消息管理弹框'
		}

        
    }else{
        id.value = ''
        Object.assign(formData,{
            account:'',
            password:'',
            name:'',
            sex:'',
            email:'',
            department:'',
        })
		if(type == 1){
			title.value = '新增产品管理弹框'
		}else if(type == 2){
			title.value = '新增用户管理弹框'
		}else if(type == 3){
			title.value = '新增消息管理弹框'
		}
        
    }

    dialogFormVisible.value = true
    console.log('type',type,'row',row)

}
//对外暴露
defineExpose({
    open
})
</script>

<style lang="scss" scoped>
	.dialog-content {
		display: flex;
		padding: 20px 30px;
	}

	:deep(.el-form-item) {
		margin: 30px;
	}
</style>
